<!-- 我的 -->
<template>
  <div class="account">
    <!-- 标题栏 -->
    <MainNavBar> </MainNavBar>
    <!-- 下拉刷新 -->
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
      <div>
        <van-card :centered="true">
          <template #thumb>
            <router-link :to="{ path: '/account/settings/Index' }">
              <van-image round :src="userInfo.Avatar | AvatarFilter" />
            </router-link>
          </template>
          <template #title>
            <div style="font-size:15px">
              {{ userInfo.UserName }}
            </div>
          </template>
          <template #desc>
            <div>
              {{ userInfo.DepartmentName }}
            </div>
          </template>
          <template #tags>
            <div>
              {{ userInfo.RoleNames }}
            </div>
          </template>
        </van-card>
        <van-row class="user-links">
          <van-col span="6">
            <van-icon
              name="records"
              @click="goToPage('/OA_Manage/OA_UserForm/List', 'processing')"
            />
            待审批
          </van-col>
          <van-col span="6">
            <van-icon
              name="tosend"
              @click="goToPage('/OA_Manage/OA_UserForm/List', 'waiting')"
            />
            等待中
          </van-col>
          <van-col span="6">
            <van-icon
              name="pending-payment"
              @click="goToPage('/OA_Manage/OA_UserForm/List', 'finish')"
            />
            审批过
          </van-col>
          <van-col span="6">
            <van-icon
              name="orders-o"
              @click="goToPage('/OA_Manage/OA_UserForm/List', 'created')"
            />
            创建的
          </van-col>
        </van-row>

        <van-cell-group class="user-group">
          <router-link :to="{ path: '/D_Manage/D_UserMessage/List' }">
            <van-cell icon="chat-o" title="全部消息" is-link />
          </router-link>
        </van-cell-group>

        <van-cell-group>
          <router-link :to="{ path: '/D_Manage/D_UserMail/Index' }">
            <van-cell icon="envelop-o" title="我的邮件" is-link />
          </router-link>
          <van-cell icon="flag-o" title="我的Tag" is-link />
          <van-cell icon="gift-o" title="我收到的礼物" is-link />
        </van-cell-group>
      </div>
    </van-pull-refresh>
  </div>
</template>

<script>
import MainNavBar from "@/components/MainNavBar";
import { mapGetters } from "vuex";

export default {
  name: "Account",
  components: {
    MainNavBar
  },
  props: {},
  data() {
    return {
      isLoading: false, // 下拉刷新

      // 右侧按钮
      rightBtn: {
        number: 2,
        iconName: ["setting-o", "chat-o"]
      }
    };
  },
  computed: {
    ...mapGetters(["userInfo"])
  },
  watch: {},
  created() {},
  methods: {
    // 右侧按钮
    handleIcon(obj) {
      if (obj.index === 0) {
        console.log("设置");
      } else {
        console.log("消息");
      }
    },

    // 下拉刷新
    onRefresh() {
      setTimeout(() => {
        this.$toast("刷新成功");
        this.isLoading = false;
      }, 500);
    },

    //页面跳转
    goToPage(name, para) {
      this.$router.push({
        name: name,
        params: { status: para }
      });
    }
  }
};
</script>

<style lang="less">
.user {
  &-poster {
    text-align: center;
    margin: 20px auto;
    width: 104px;
    height: 104px;
    overflow: hidden;
  }

  &-group {
    margin-bottom: 15px;
  }

  &-links {
    padding: 15px 0;
    font-size: 12px;
    text-align: center;
    background-color: #fff;

    .van-icon {
      display: block;
      font-size: 24px;
    }
  }
}
</style>
